<template>
	<div class="goods-setlet-addresslist mescroll" id="mescroll" style="height: 100%;">
		<div class="list">
			<div v-for="(item, index) in info" :key='index' class='item' :class='[index>0?"marginT":""]' @click="choice(item)">
				<div slot="content" class="demo-content vux-1px-t ">
					<p class="contentPFir">
						<span>{{item.consignee}}</span>
						<span class="contentPhone">{{item.phone}}</span>
					</p>
					<p class="contentPSec"><span v-if="index==0" class="normal-address">[默认地址]</span>{{item.provinceName}}{{item.cityName}}{{item.areaName}}{{item.townName}}{{item.address}}</p>
				</div>
			</div>
		</div>
		<div class="addressadd_bth" @click="toListAddress">
			管理
		</div>
		
	</div>
</template>

<script>
	import http from '@/util/http'
  import Api from '@/util/api'
  import mScroll from 'mescroll';
  import "mescroll/src/mescroll.min.css";
  import utils from '@/util/util'
	export default{
		data () {
			return {
				info: []
				,pageNum: 1
			}
		}
		,created: function () {
			http.post(Api.listUserAddress,{numPerPage: 12, order: "desc", pageNum: 1, type: "N",userId:utils.getUserInfo().user.id}).then(res => {
				this.info = res.data.rows;
			})
		}
		,mounted(){
			var self = this;
			self.mescroll = new mScroll("mescroll", { 
				down: {
					callback: self.downCallback //下拉刷新的回调,别写成downCallback(),多了括号就自动执行方法了
				},
				up: {
					callback: self.upCallback , //上拉加载的回调
					isBounce: true //如果您的项目是在iOS的微信,QQ,Safari等浏览器访问的,建议配置此项.解析(必读)
					,offset: 50
				}
			});
	    }
		,methods:{
		   downCallback() {
		   	console.log('down')
//		    	this.resetloadmore;
//		    	this.pageNum = 1;
//		    	this.getmessagecount({state: "NOTREAD", userId: userId});
//		    	this.queryhome();
//		    	this.setcreditAmount(this.userInfo);
//		    	this.mescroll.endDownScroll(false);
//		    	this.mescroll.endUpScroll(false);
//		    	this.mescroll.lockUpScroll(false);
				http.post(Api.listUserAddress,{numPerPage: 12, order: "desc", pageNum: 1, type: "N",userId:utils.getUserInfo().user.id}).then(res => {
					if (res.code == 200) {
						this.pageNum=1;
						this.info = res.data.rows;
						this.mescroll.endDownScroll(false);
				    	this.mescroll.endUpScroll(false);
				    	this.mescroll.lockUpScroll(false);
					}else{
						this.toast(res.message)
					}
				})
		    }
		    ,upCallback() {
		    	console.log('up')
		    	this.pageNum++;
				http.post(Api.listUserAddress,{numPerPage: 12, order: "desc", pageNum: this.pageNum, type: "N",userId:utils.getUserInfo().user.id}).then(res => {
					
					if (res.code == 200) {
						this.info = [...this.info,...res.data.rows];
						this.mescroll.endUpScroll(false)
						if (this.info.length == res.data.total) {
							this.mescroll.endUpScroll(true);
							this.mescroll.lockUpScroll();
						}
					}else{
						this.toast(res.message)
					}
				})
		    }
		    ,toListAddress(){
		    	this.$router.push('/list-address')
		    }
		    ,choice(item){
		    	let subInfo = Object.assign(this.goodsIndex,{'frompage':'/setlet-addresslist'},item)
		    	sessionStorage.setItem('subInfo',JSON.stringify(subInfo));
		    	this.$router.replace({path:'/submit-goods',query:{'frompage':'/setlet-addresslist'}})
		    }
		}
		,computed: {
			goodsIndex() {
				return JSON.parse(sessionStorage.getItem('subInfo')) 
			}
		}
	}
</script>

<style lang="less" rel="stylesheet/less">
	.goods-setlet-addresslist{
		background: #F2F2F2;
		.marginT{
			margin-top: .18rem;
		}
		.mescroll-upwarp{
			padding-bottom: 1rem;
		}
		.item{
			padding: .2rem .3rem 0 .3rem;
			background: #FFFFFF;
			min-height: 1.1rem;
			position: relative;
			.contentPFir{
				height: .4rem;
				line-height: .4rem;
				font-size: .28rem;
				color: #464646;
				.contentPhone{
					margin-left: .36rem;
				}
			}
			.contentPSec{
				margin-top: .1rem;
				width: 6.9rem;
				line-height: .33rem;
				color: #909090;
				font-size: .24rem;
			}
			.normal-address{
				color:#FBC200;
			}
		}
		.addressadd_bth{
			text-align: center;
			background: #fbc200;
			color: #464646;
			font-size: .32rem;
			height:1rem;
			line-height: 1rem;
			position:fixed;
			bottom:0;
			width:7.5rem;
		}
	}
</style>